<script>
// import LayerToolDecision from "@/components/LayerTool/layer-tool-decision.vue";
import SectionOne from './modules/Section-1/section-1.vue';
import SectionTwo from './modules/Section-2/section-2.vue';
import SectionThree from './modules/Section-3/section-3.vue';
import SectionFour from './modules/Section-4/section-4.vue';
import SectionFive from './modules/Section-5/section-5.vue';
import SectionSix from './modules/Section-6/section-6.vue';
import SectionCenter from './modules/Section-center/section-center.vue';
export default {
  name: "Decision",
  components: {
    SectionOne,
    SectionTwo,
    SectionThree,
    SectionFour,
    SectionFive,
    SectionSix,
    SectionCenter
    // LayerToolDecision
  },
  data() {
    return {
    };
  },
  mounted() {
  },
  computed: {
    slideMode() {
      return this.$store.state.slideMode
    }
  },
  beforeRouteLeave() {
  },
  methods: {
  },
};
</script>
<template>
  <section-four class="slide-left" :class="[slideMode]"></section-four>
  <section-five class="slide-left" :class="[slideMode]"></section-five>
  <section-six class="slide-left" :class="[slideMode]"></section-six>

  <section-one class="slide-right" :class="[slideMode]"></section-one>
  <section-two class="slide-right" :class="[slideMode]"></section-two>
  <section-three class="slide-right" :class="[slideMode]"></section-three>
  <section-center></section-center>
</template>
<style scoped lang="less">
.slide-left,
.slide-right {
  transition: all .3s;
}

.slide-left.close {
  transform: translateX(-50rem);
}

.slide-right.close {
  transform: translateX(50rem);
}
</style>